/*
 * Copyright (c) 2007-2020 西安交通信息投资营运有限公司 版权所有
 * 作者:焦元义
 */

import React, {FC} from 'react';
import {Card, Descriptions, Divider, Drawer, Spin, Tabs, Tag} from 'antd';
import styles from '@/utils/utils.less'
import {DetailsComponentProps} from '@/utils/data';
import {SysDicModel} from '../data';
import HistoryLogTable from '@/components/HistoryLog';
import {getCurrentUser} from "@/utils/utils";
import useLoad from "@/hooks/useLoad";
import service from "@/pages/sys/dic/service";
import {DetailsDialogProps} from "@/global";

const {TabPane} = Tabs;
const currentUser = getCurrentUser();

/** 系统字典详情组件属性 */
export interface DetailsProps extends DetailsComponentProps<SysDicModel> {
}

/** 系统字典详情组件 */
const SysDicDetails: FC<DetailsDialogProps> = (props) => {
  const {params: {id}, visible, hide} = props;
  const {loading, data: model} = useLoad<SysDicModel>({
    isLoad: Boolean(id),
    onLoad: () => service.selectById(id)
  }, [id]);

  return (
    <Drawer
      title="查看模块详细信息"
      width="50%"
      visible={visible}
      onClose={hide}
      destroyOnClose
      className={styles.drawerBodyPadding}>
      <Spin spinning={loading} wrapperClassName={styles.h100p}>
        <Tabs className={styles.drawerBodyTabsPadding}>
          <TabPane tab="基本信息" key="basic">
            {model && (
              <Card bordered={false} className={styles.cardBodyDesc}>
                <Descriptions column={1} bordered={true} size="small" className={styles.detailsDescriptions}>
                  {/*<Card>*/}
                  {/*  <Descriptions column={1} bordered={true} size="small" title="基本信息" className={styles.dividerMarginBottom}>*/}
                  {currentUser.admin && (<Descriptions.Item label="字典主键" >{model.id}</Descriptions.Item>)}
                  {/*<Descriptions.Item label="字典主键">{model?.id}</Descriptions.Item>*/}
                  {currentUser.admin&&<Descriptions.Item label="字典上级主键">{model.parentId}</Descriptions.Item>}
                  <Descriptions.Item label="字典类型编码">{model.categoryCode}</Descriptions.Item>
                  <Descriptions.Item label="字典名称">{model.name}</Descriptions.Item>
                  <Descriptions.Item label="字典值">{model.value}</Descriptions.Item>
                  <Descriptions.Item label="序号">{model.path}</Descriptions.Item>
                  <Descriptions.Item label="状态"><Tag
                    color={model.status === true ? '#87d068' : '#f50'}>{model.status === true ? '启用' : '禁用'}</Tag></Descriptions.Item>
                  <Descriptions.Item label="备注">{model.remark}</Descriptions.Item>
                </Descriptions>
                <Divider className={styles.dividerMarginBottom}/>
              </Card>
            )}
          </TabPane>
          <TabPane tab="操作日志" key="history">
            {model && (<HistoryLogTable tableName="SysDic" primaryKey={model.id}/>)}
          </TabPane>
        </Tabs>
      </Spin>
    </Drawer>);
};
export default SysDicDetails;

